<template>
	<view class="page-address page">
		<view class="b-header">
			<pageHeader :title="title"></pageHeader>
		</view>
		<view class="b-content p-30 p-b-130">
			<view class="form-item fsb df-ac">
				<view class="label">联系人</view>
				<input type="text" value="" placeholder="请输入联系人"  />
			</view>
			<view class="form-item fsb df-ac">
				<view class="label">手机号</view>
				<input type="text" value="" placeholder="请输入手机号"  />
			</view>
			<view class="form-item fsb df-ac">
				<view class="label">详细地址</view>
				<input type="text" value="" placeholder="请输入详细地址"  />
			</view>
			<view class="df-ac mt-30">
				<image v-if="show" @click="show=!show" src="../../static/imgs/check-p.png" mode="" class="icon-check"></image>
				<view v-if="!show" @click="show=!show" class="icon-uncheck"></view>
				<text class="fz24 c-72">设为默认地址</text>
			</view>
			<view class="btn-add">保存</view>
		</view>
	</view>
</template>

<script>
	import addressItem from '../../components/addressItem.vue'
	export default {
		components:{
			addressItem
		},
		data() {
			return {
				list: [
					{id:1,title:'如何查看我的订单？'},
					{id:2,title:'忘记登录密码怎么找回呢？'},
					{id:3,title:'订单发货了好几天没有收到货怎么办？'},
				],
				id:'',
				title:'',
				show:true
			}
		},
		onLoad(op) {
			this.id = op.id
			this.title = op.id?'编辑地址':'新增地址'
		},
		methods: {
			
		}
	}
</script>

<style lang="scss">
.page-address {
	.b-content {
		padding-bottom: 130rpx;
	}
	.btn-add {
		background: linear-gradient(180deg,#8663e8, #4f34cc);
		border-radius: 11rpx;
		height: 90rpx;
		line-height: 90rpx;
		text-align: center;
		color: #fff;
		position: fixed;
		left: 30rpx;
		right: 30rpx;
		bottom: 30rpx;
	}
	.form-item {
		margin-bottom: 10rpx;
		padding: 20rpx 0;
		.label {
			margin-bottom: 0;
		}
		input {
			text-align: right;
			flex:1;
		}
	}
	.icon-check,
	.icon-uncheck{
		width: 30rpx;
		height: 30rpx;
		margin-right: 20rpx;
	}
	.icon-uncheck {
		border: 1px solid #dedede;
		
	}
}
</style>
